<template>
	<view class="all" :style="{'height':widHeight + 'px'}">
		<view class="verify">
			<view class="">
				系统将按照下方的顺序进行验证
			</view>
			<view class="vreify-img" @click="relaySequence">
				<image src="../../static/切换顺序.png" mode="aspectFit"></image>
				<text>切换顺序</text>
			</view>
		</view>
		<view class="biologicalPayment" :class="{active:act == true}">
			<view class="biologicalPayment-1">指纹支付</view>
			<view class="biologicalPayment-2">
				<u-switch v-model="value13" asyncChange @change="asyncChange(value13,'指纹支付')"></u-switch>
			</view>
		</view>
		<view class="biologicalPayment" :class="{active:act == false}">
			<view class="biologicalPayment-1">手机刷脸支付</view>
			<view class="biologicalPayment-2">
				<u-switch v-model="value14" asyncChange @change="asyncChange(value14,'手机刷脸支付')"></u-switch>
			</view>
		</view>
		<view class="bb">
			<u-link href="https://uviewui.com/" text="《虚拟模拟许生物识别服务规则》"></u-link>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				value13: false,
				value14: false,
				act: true,
				widHeight: 0,
			};
		},
		onLoad() {
			uni.$setNavigationBarColor()
			const windowInfo = uni.getWindowInfo()
			this.widHeight = windowInfo.windowHeight //可使用窗口宽度
		},
		methods: {
			asyncChange(e, str) {
				uni.showModal({
					content: !e ? `确定${str}打开吗` : `确定关闭${str}吗`,
					success: (res) => {
						if (res.confirm) {
							if (str === '指纹支付' && !this.value13) {
								this.value13 = !this.value13
								this.discriminate(str)
							}
							if (str === '手机刷脸支付' && !this.value14) {
								this.value14 = !this.value14
								this.discriminate(str)
							}
							if (e) {
								if (str == '指纹支付') {
									this.value13 = !this.value13
								} else {
									this.value14 = !this.value14
								}
							}
						}
					},
				})
			},
			//切换顺序
			relaySequence() {
				this.act = !this.act
			},
			//指纹支付
			discriminate(str) {
				if (str == '指纹支付') {
					uni.startSoterAuthentication({
						requestAuthModes: ['fingerPrint'],
						challenge: '123456',
						authContent: '请输入指纹',
						success(res) {
							uni.$showToast("输入指纹成功")
						},
						fail:(err)=>{
						
							this.value13 = false
						}
						
					})
				} else {
					uni.navigateTo({
						url:"/subAbility/faceSwiping/faceSwiping"
					})
				}


				// wx.checkIsSoterEnrolledInDevice({
				// 	checkAuthMode: 'fingerPrint',
				// 	success(res) {
				// 		if (res.isEnrolled) {

				// 		}
				// 	}
				// })
			}
		},

	}
</script>

<style lang="scss">
	.all {
		background-color: #f1f3f4;

		.active {
			border: 2px solid red;
		}

		.biologicalPayment {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 15px;
			margin-top: 15px;
			background-color: white;
			height: 50px;
		}

		.verify {
			display: flex;
			justify-content: space-between;
			font-size: 13px;
			color: #5f6368;
			padding: 15px 15px 0 15px;

			.vreify-img {
				display: flex;
				align-items: center;

				text {
					color: #3c9cff;
				}

				image {
					padding-right: 5px;
					width: 15px;
					height: 15px;
				}
			}

		}

		.bb {
			width: 100%;
			position: absolute;
			bottom: 50px;
			left: 50%;
			right: 0;
			transform: translateX(-30%);


		}
	}
</style>